/* 订单记录 */
<template>
  <div class="app-container">
    <p>
      <el-radio-group v-model="queryParams.itemType" @change="getList">
        <el-radio-button :label="1">下单记录</el-radio-button>
        <el-radio-button :label="2">接单记录</el-radio-button>
        <el-radio-button :label="3">派单记录</el-radio-button>
        <el-radio-button :label="4">申诉记录</el-radio-button>
      </el-radio-group>
    </p>
    

    <el-table v-if="queryParams.itemType === 2 || queryParams.itemType === 1" v-loading="loading" :data="catUserOrderList" >
      <el-table-column label="订单编号" align="center" prop="code" />
      <el-table-column v-if="queryParams.itemType === 2" label="下单用户" align="center" prop="bookingName" >
       <template slot-scope="scope">
          <span>{{ scope.row.bookingName +"("+ scope.row.bookingCode + ")" }}</span>
        </template>
      </el-table-column>
      <el-table-column label="品类" align="center" prop="gameName" />
      <el-table-column label="大区" align="center" prop="regionName" />
      <el-table-column v-if="queryParams.itemType === 1" label="接单大神" align="center" prop="accompanyName" >
       <template slot-scope="scope">
          <span>{{ scope.row.accompanyName +"("+ scope.row.accompanyCode + ")" }}</span>
        </template>
      </el-table-column>
      <el-table-column label="数量" align="center" prop="number">
        <template slot-scope="scope">
          <span>{{ scope.row.number +"("+ scope.row.unit + ")" }}</span>
        </template>
      </el-table-column>
      <el-table-column label="优惠券" align="center"   prop="voucherCardAmount" />
      <el-table-column label="补差价" align="center" prop="differencePrice" />
      <el-table-column label="实付总价" align="center" prop="paidPrice" />
      <el-table-column label="状态" align="center" prop="status" >
        <template slot-scope="scope">
          <span v-if="scope.row.status==1">进行中</span>
          <span v-else-if="scope.row.status==2">已完成</span>
          <span v-else-if="scope.row.status==3">已取消</span>
          <span v-else>--</span>
        </template>
      </el-table-column>
      <el-table-column v-if="queryParams.itemType === 1" label="支付方式" align="center" prop="paymentMethod" />
      <el-table-column v-if="queryParams.itemType === 1" label="下单渠道" align="center" prop="orderChannel" />
      <el-table-column v-if="queryParams.itemType === 2" label="订单收益" align="center" prop="orderIncome" />
      <el-table-column label="提交时间" align="center" prop="createTime" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.createTime) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="完成时间" align="center" prop="orderTime" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.orderTime) }}</span>
        </template>
      </el-table-column>
    </el-table>

    <el-table v-if="queryParams.itemType === 3" v-loading="loading" :data="userOrderDispatchList" >
      <el-table-column label="派单编号" align="center" prop="code" />
      <el-table-column label="派单时间" align="center" prop="createTime" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.createTime) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="房间编号" align="center" prop="chatroomCode" />
      <el-table-column label="归属厅室" align="center" prop="chatroomType" />
      <el-table-column label="派单品类" align="center" prop="teamCategoryItemId" />
      <el-table-column label="价格(/次)" align="center" prop="price" />
      <el-table-column label="跳单人数" align="center" prop="skipOrders" />
      <el-table-column label="派单状态" align="center" prop="status" >
        <template slot-scope="scope">
            <span v-if="scope.row.createTime ===1 ">未成交</span>
            <span v-eles-if="scope.row.createTime ===2 ">已成交</span>
            <span v-eles>--</span>
          </template>
        </el-table-column>
      <el-table-column label="订单编号" align="center" prop="orderCode" />
    </el-table>

    <el-table v-if="queryParams.itemType === 4" v-loading="loading" :data="userOrderAppealList" >
      <el-table-column label="申诉编号" align="center" prop="code" />
      <el-table-column label="申诉订单号" align="center" prop="orderCode" />
      <el-table-column label="申诉用户" align="center" prop="userId" />
      <el-table-column label="申诉理由" align="center" prop="reason" />
      <el-table-column label="截图" align="center" prop="screenshot" />
      <el-table-column label="状态" align="center" prop="status">
        <template slot-scope="scope">
          <span v-if="scope.row.status ===1 ">待处理</span>
          <span v-else-if="scope.row.status ===2 ">已拒绝</span>
          <span v-else-if="scope.row.status ===2 ">已退款</span>
          <span v-else>异常</span>
        </template>
      </el-table-column>
      <el-table-column label="提交时间" align="center" prop="createTime" width="180">
        <template slot-scope="scope">
          <span >{{ parseTime(scope.row.createTime) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="处理时间" align="center" prop="dealTime" width="180">
        <template slot-scope="scope">
          <span v-if="scope.row.dealTime">{{ parseTime(scope.row.dealTime) }}</span>
          <span v-else>--</span>
        </template>
      </el-table-column>
      <el-table-column label="操作人" align="center" prop="createBy" />
      </el-table-column>
    </el-table>
    
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

  </div>
</template>

<script>

import { listUserOrderDispatch } from "@/api/system/userOrderDispatch";
import { listUserOrderAppeal } from "@/api/system/userOrderAppeal";
import { listUserOrder } from "@/api/system/userOrder";

export default {
  data() {
    return {
      userOrderDispatchList:[],
      userOrderAppealList:[],
      catUserOrderList:[],

      // 遮罩层
      loading: true,
      // 总条数
      total: 0,
      // 用户登录日志表格数据
      catUserLogList: [],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        userId: undefined,
        itemType: 1,
      }
    };
  },
  created() {
  },
  methods: {
    /** 查询用户登录日志列表 */
    getList() {
      this.loading = true;
      if(this.queryParams.itemType === 1 ){
        const param = {
          pageNum: this.queryParams.pageNum,
          pageSize: this.queryParams.pageSize,
          bookingId: this.queryParams.userId
        }
        listUserOrder(param).then(response => {
          this.catUserOrderList = response.rows;
          this.total = parseInt(response.total);
          this.loading = false;
        });
      }else if(this.queryParams.itemType === 2){
        const param = {
          pageNum: this.queryParams.pageNum,
          pageSize: this.queryParams.pageSize,
          accompanyId: this.queryParams.userId
        }
        listUserOrder(param).then(response => {
          this.catUserOrderList = response.rows;
          this.total = parseInt(response.total);
          this.loading = false;
        });
      }else if(this.queryParams.itemType === 3){
        listUserOrderDispatch(this.queryParams).then(response => {
          this.userOrderDispatchList = response.rows;
          this.total = parseInt(response.total);
          this.loading = false;
        });
      }else if(this.queryParams.itemType === 4){
        listUserOrderAppeal(this.queryParams).then(response => {
          this.userOrderAppealList = response.rows;
          this.total = parseInt(response.total);
          this.loading = false;
        });
      }
    },
    init(userId){
      this.queryParams.userId = userId
      this.getList()
    }
  }
};
</script>